<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML>
<html>
<head>
<!-- 设置页面的 基本路径，页面所有资源引入和页面的跳转全部基于 base路径 -->
<base href="<%=basePath%>">
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="lib/zTree/v3/css/zTreeStyle/zTreeStyle.css" type="text/css">

<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="lib/zTree/v3/js/jquery.ztree.all-3.5.min.js"></script> 
</head>

<button onclick="getCheckedData();">获取选中的节点的数据</button>

<!-- zTree列表 -->
 <ul id="permissionTree" class="ztree"></ul>
 
 <script type="text/javascript">
 /* zTree 的设置对象*/
 var setting={
		 /*异步加载数据*/
			async: {
			enable: true,
			url:"permission/getAllPermission.do",
			/* 数据过滤 （对ajax返回数据预处理）,zTree渲染效果之前 */
			dataFilter: ajaxDataFilter 
		},
		 data:{
			 /* 设置支持简单数据 */
			 simpleData:{
				 enable:true,
				 idKey:"permissionId",
				 pIdKey:"parentId"
			 }
		 },
		 check:{
			 enable:true
		 }
 }	;
 
	/* 预处理数据函数 */
	function ajaxDataFilter(treeId, parentNode, responseData) {
	    if (responseData) {
	      for(var i =0; i < responseData.length; i++) {
			//清空url地址，防止点击跳转
			responseData[i].url = null;
			responseData[i].open = true;
	    	  console.log(responseData[i]);
			
	      }
	    }
	    return responseData;
	};
 /* 初始化zTree */
 $(function(){
		$.fn.zTree.init($("#permissionTree"), setting);
 });
 
 /* 获取选中的节点的数据*/
   function getCheckedData(){
	 //获取zTree树对象： 没有# ，不是jquery的id选择器
	 var treeObj=$.fn.zTree.getZTreeObj("permissionTree");
	 //获取选中的节点
	 var nodes=treeObj.getCheckedNodes(true);
	 
	 //声明数组用于封装权限id
	 var permissionIdsArr=[];
	 //循环节点
	 for(var i=0;i<nodes.length;i++){
		 var node=nodes[i];
		 
		 permissionIdsArr.push(node.permissionId);
	 }
	 console.log(permissionIdsArr)
	 var permissionIds=permissionIdsArr.join(",");
	 console.log(permissionIds);
 }
 </script>
 
<body>

</body>
</html>